/* {{{ FONT */
	
	@font-face {
	    font-family: 'concrete';
	    src: url('cmunobx-webfont.eot');
	    src: url('cmunobx-webfont.eot?#iefix') format('embedded-opentype'),
		 url('cmunobx-webfont.woff') format('woff'),
		 url('cmunobx-webfont.ttf') format('truetype');
	    font-weight: bold;
	    font-style: normal;
	}
	
	@font-face {
	    font-family: 'concrete';
	    src: url('cmunorm-webfont.eot');
	    src: url('cmunorm-webfont.eot?#iefix') format('embedded-opentype'),
		 url('cmunorm-webfont.woff') format('woff'),
		 url('cmunorm-webfont.ttf') format('truetype');
	    font-weight: normal;
	    font-style: normal;
	}
	
	@font-face {
	    font-family: 'monofur';
	    src: url('monof55-webfont.eot');
	    src: url('monof55-webfont.eot?#iefix') format('embedded-opentype'),
		 url('monof55-webfont.woff') format('woff'),
		 url('monof55-webfont.ttf') format('truetype');
	    font-weight: normal;
	    font-style: normal;
	} 
/* }}} */


/* {{{ DEFAULT RESET & SET */
	a, abbr, acronym, address, applet, article, aside, audio,b, big, blockquote, body,canvas, caption, center, cite, code,dd, del, details, dfn, dialog, div, dl, dt,em, embed,fieldset, figcaption, figure, font, footer, form,h1, h2, h3, h4, h5, h6, header, hgroup, hr, html,i, iframe, img, ins,kbd,label, legend, li,mark, menu, meter,nav,object, ol, output,p, pre, progress,q,rp, rt, ruby,s, samp, section, small, span, strike, strong, sub, summary, sup,table, tbody, td, tfoot, th, thead, time, tr, tt,u, ul,var, video,xmp {
		border: 0;
		margin: 0;
		padding: 0;
		font-size: 100%;
	}
	
	label, input[type=button], input[type=submit], button, a span {cursor: pointer;}
	a img {border : 0;}
	a:hover {text-decoration : none; }
	
	sup {
		font-size : 0.8em;
		height: 0;
		line-height: 1;
		vertical-align: baseline;
		position: relative;
		bottom: 1ex;
	}
	sub {
		font-size : 0.8em;
		height: 0;
		line-height: 1;
		vertical-align: baseline;
		position: relative;
		top: 1ex;
	}
	small {font-size : 0.8em;}
	
	.hide {visibility : hidden; position : absolute;}
	.cleaner {clear : both;}
	a span.text {visibility : hidden;}
/* }}} */

/* {{{ GENERAL */
	body {
		background-color : #fff;
		color : #000;
		padding : 20px;
		font : 18px 'concrete',serif;
	}
	h1 {
		font-weight : 600;
		font-size : 24px;
		border-bottom : 1px solid #8CCCD1;
		margin-bottom : 40px;
	}
	h1 small {
		font-size : 14px;
		color : #999;
	}
/* }}} */

/* {{{ FORM */
	form {
		border-bottom : 1px solid #8CCCD1;
		margin-bottom : 40px;
	}
	form p {
		margin-bottom : 20px;
	}
	span.label {
		display : block;
		float : left;
		clear : both;
		width : 120px;
		margin-right : -120px;
		font-weight : 600;
		color : #555;
	}
	form input.indent,
	form input[type=submit] {
		margin-left : 120px;
		display: inline-block;
	}
	form input[type=text] {
		padding : 2px 4px;
		font : 16px 'concrete',serif;
		width : 70%;
		text-transform:uppercase;
	}
	#sum {width : 50px; text-align : right;}
	form input:focus {
		box-shadow : 0 0 10px #8CCCD1;
	}
	form input[type=submit] {
		font : 18px 'concrete',serif;
	}
	.error {color : #c00;}
/* }}} */

/* {{{ RESULTS */
	.result {
		width : 100%;
		overflow : hidden;
		margin-bottom : 20px;
	}
	.result .info {
		white-space : nowrap;
		position : relative;
		cursor : pointer;
	}
	.result .preContainer {
		height: 0;
		background-color : #E0EEEF;
		padding : 0 20px;
	}
	.result pre {
		overflow-x : scroll;
		font : 16px 'monofur',monospace;
		padding : 20px 0;
	}
	.result .expand {
		display : inline-block;
		height : 100%; width : 30px;
		position : absolute;
		right : 0;
		top : 0;
		background-color : #fff;
		text-align : center;
	}
	.result .info:hover .expand {
		text-shadow : 0 0 5px #3BB5BF;
	} 
	.result .fade {
		display : inline-block;
		height : 100%; width : 50px;
		position : absolute;
		right : 30px;
		top : 0;
		background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1)));
		background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
		background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
		background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
		background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );
	}
	#time {
		font-size : 14px;
		position : absolute;
		top : 0;
		right : 0;
		padding-right : 10px;
	}
/* }}} */
